<template>
  <CommonPanel title="告警趋势">
    <template #content>
      <div id="historyChart"></div>
    </template>
  </CommonPanel>
</template>

<script setup>
import { historyWarning } from '@/cesiumTools/echartsOpts';
import * as echarts from 'echarts';
import { onMounted } from 'vue';
import { historyWarningData } from '@/store/staticData';
import CommonPanel from '../panel/CommonPanel.vue';

onMounted(() => {
  initChart();
});

const initChart = () => {
  const myChart = echarts.init(document.getElementById('historyChart'));
  const options = historyWarning(historyWarningData);
  myChart.setOption(options);
};
</script>
<style scoped lang="scss">
#historyChart {
  width: 500px;
  height: 230px;
  margin: 0 auto;
}
</style>
